$(function () {
    var vm = new Vue({
        el:"#content",
        data:{
            blog:{},//博客
            blogType:{},//博客类型
            comments:{},//评论
            keyWords:"",//关键字
            releaseDate:"",//博客格式化日期
            id:"",//博客id
        },
        methods:{
            //获取跳转路径后面的参数
            getQueryString(name) {
                var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
                var r = window.location.search.substr(1).match(reg);
                if (r != null) return unescape(r[2]);
                return null;
            },
            //修改日期格式
            DateToString() {
                Date.prototype.toString = function () {
                    return this.getFullYear() + "-" + (this.getMonth() + 1) + "-" + this.getDate()
                        + " " +this.getHours() +":" +this.getMinutes() + ":" + this.getSeconds();
                };
            },
            //提交评论
            submitComment(){
                var comment = { //评论表
                    blogId:this.id,
                    content:$('#comment').val(),
                }
                //判断评论内容是否为空
                if(comment.content == null || comment.content.length == 0){
                    alert("评论内容不能为空！");
                    return;
                }
                axios.post("http://localhost:8081/kun/foreign/comment/insertComment",comment).then(res=>{
                    if(res.data.code == 200){
                        alert("博客评论成功！待审核通过后显示");
                        $("#comment").val("");//清空评论输入框信息
                    }else {
                        alert("提交失败!");
                    }
                });
            }
        },
        created(){
            this.DateToString();

            //获取博客详情
            this.id = Number(this.getQueryString("id"));
            var id = this.id;
            axios.post("http://localhost:8081/kun/foreign/blog/queryBlogById",{id}).then(res=>{
                this.blog = res.data.data.blog;
                this.blogType = this.blog.blogtype;
                $("#blogContent").append(this.blog.content);
                var comments = res.data.data.comments;
                this.comments = comments;
                this.keyWords = res.data.data.keyWords;
                this.releaseDate = new Date(this.blog.releaseDate);
                var commentsDiv = $('#comments');//标签
                var i = 0;//临时变量  定义楼层的
                $(this.comments).each(function (index) {
                    var commentDate = new Date(comments[index].commentDate);
                    var div = "<div class='content bg-info text-info'>" +
                                    "<span>"+(++i)+"</sapn>楼" +
                                    "<span>"+comments[index].content+"</span>" +
                                    "<span>"+commentDate+"</span>" +
                                "</div>";
                    commentsDiv.append(div);
                })
            });

            //查询当前博客的上一篇以及下一篇
            axios.post("http://localhost:8081/kun/foreign/blog/queryBlogByPrevAndNext",{id}).then(res=>{
                var lastAndNextPage = $('#blog_lastAndNextPage');//获取标签
                var blogs = res.data.data.blogs;
                if (blogs[0] == null){
                    lastAndNextPage.append("<p>上一篇：没有上一篇了~</p>");
                    lastAndNextPage.append("<p>下一篇：<a href='view.html?id="+blogs[1].id+"'>"+blogs[1].title+"</a></p>");
                }else if (blogs[1] == null){
                    lastAndNextPage.append("<p>上一篇：<a href='view.html?id="+blogs[0].id+"'>"+blogs[0].title+"</a></p>");
                    lastAndNextPage.append("<p>下一篇：没有下一篇了~</p>");
                }else {
                    lastAndNextPage.append("<p>上一篇：<a href='view.html?id="+blogs[0].id+"'>"+blogs[0].title+"</a></p>");
                    lastAndNextPage.append("<p>下一篇：<a href='view.html?id="+blogs[1].id+"'>"+blogs[1].title+"</a></p>");
                }
            });
        }
    })
})